.content {
  background: black;
  border-radius: 32rpx 32rpx 0 0;
  margin-top: -30rpx;
  position: relative;
  z-index: 1;

  .nav {
    padding-top: 10rpx;
    position: relative;

    .n {
      width: 25%;
      text-align: center;
      padding: 20rpx 0;
      font-size: 32rpx;
      color: #fff;
    }

    .line {
      position: absolute;
      bottom: 0;
      width: 25%;
      height: 4rpx;
      background: #ffd700;
    }
  }

  .wraper {
    padding: 30rpx 30rpx 0 30rpx;

    .gn {
      display: flex;
      justify-content: space-between;
      padding: 0 30rpx;

      .gn_item {
        font-size: 24rpx;
        color: #bababb;
        text-align: center;

        .icon {
          margin: 0 auto 10rpx;
          font-size: 40px;
          color: #fff;
          display: block;
        }
      }
    }

    .ip {
      padding-bottom: 20rpx;
      font-size: 24rpx;
      color: #bababb;
      display: flex;
      align-items: center;

      > text {
        padding-left: 20rpx;
      }
    }

    .desc {
      padding-top: 40rpx;
      padding-bottom: 16rpx;
      word-break: break-all;
      word-wrap: break-word;
      white-space: pre-line;
      color: #bababb;
      font-size: 26rpx;
    }

    .detaiil {
      display: flex;
      align-items: center;
      justify-content: space-between;

      .d_right {
        padding: 16rpx 40rpx;
        border-radius: 8rpx;
        background: #3a3a46;
        font-size: 30rpx;
        color: #fff;
      }

      .d_left {
        padding-right: 80rpx;
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: space-between;

        .d_left_item {
          text-align: center;

          view {
            &:first-child {
              color: #fff;
              font-size: 28rpx;
            }

            &:last-child {
              color: #bababb;
              font-size: 24rpx;
              padding-top: 10rpx;
            }
          }
        }
      }
    }
  }
}
